
  
  //vue-router.js
  import Vue from 'vue'
  import RouterLink from './router-link'
  import RouterView from './router-view'
  
  let _Vue 
  class VueRouter {
      constructor(options) {
          this.current = ''
          this.$options = options
          this.routeMap = {}
          this.$options .forEach(obj => {
              this.routeMap[obj.path] = obj
          });
          this.current = window.location.hash.slice(1) || '/'
          this.matchList = []//响应改成matchList
          Vue.util.defineReactive(this,'matchList',[])
          this.match()
          this.onHashChange = this.onHashChange.bind(this)
          window.addEventListener('hashchange',this.onHashChange)
  
      }   
      onHashChange() {
          this.current = window.location.hash.slice(1)
          this.matchList = []
          this.match()
      }
      //约束 嵌套router-view
      match(routes) {
          routes = routes || this.$options
          for (const route of routes) { //遍历的是第一层 
              if (route.path === '/' && this.current === '/') { //判断如果是根 则直接返回
                  this.matchList.push(route)
                  return
              }
              //如果当前是 /about , 
              if (route.path !== '/' && this.current.indexOf(route.path) != -1) {
                  this.matchList.push(route) //添加一个/about
                  if(route.children) {
                      this.match(route.children) //再递归 添加 children 里的 /about/info 
                  }
              }
          }
      }
  }
  
  VueRouter.install = function (Vue) {
      _Vue = Vue
      Vue.mixin({
          beforeCreate(){
              if(this.$options.router) {
                  Vue.prototype.$router = this.$options.router
              }
          }
      })
      Vue.component("router-link", RouterLink)
      Vue.component("router-view", RouterView)
  }
   
  export default VueRouter
   